<template>
  <div class="video">
    <div class="title-wrapper">
      <span class="tag">MV</span>
      <span class="title">{{mvName}}</span>
      <span class="artist">{{mvArtist}}</span>
    </div>
    <video :src="mvUrl" autoplay controls=""></video>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        mvName: '',
        mvUrl: '',
        mvArtist: '',
        baseUrl: "https://autumnfish.cn"
      };
    },
    async created() {
      if (!this.$route.params.mvid) {
        alert("未传入歌曲 mv id 信息，请检查操作！")
        window.history.back(-1)
        return
      }
      console.log(111);
      let backData = await this.$axios.get(`${this.baseUrl}/mv/detail?mvid=${this.$route.params.mvid}`);
      console.log(backData);
      console.log(this.$route.params.mvid);

      this.mvName = backData.data.data.name;
      this.mvArtist = backData.data.data.artistName;
      let res = await this.$axios.get("/mv/url?id=" + this.$route.params.mvid);
      console.log(res.data.data.url)
      this.mvUrl = res.data.data.url
    }
  }
</script>

<style scoped>
  @import "@/assets/css/video.css";
</style>